.soul-drop-panel{
  width:100%;
  height: 100%;

  .is-preview &{
    transition:  box-shadow @transition-time linear;
    position: relative;
    .makeContainer()
  }


  .is-preview > &{
    .makeContainer();
    border: none;
    height:800px;
    padding: 0;
  }

  .layout-scroll > &{
    height:800px;
  }

  &  [class^="ivu-row"]{
    .is-preview &{
      .makeContainer();
    }
  }

  & [class^="ivu-col"]{
    .is-preview &{
      .makeContainer();
    }
  }

  & .ivu-form{
    min-height: 60px;
    .is-preview &{
      .makeContainer();
    }
  }

  & .ivu-form-item{
    .is-preview &{
      .makeContainer();
    }
  }

  .ivu-form .ivu-form,.ivu-form .ivu-form-item{
    padding: 0;
    min-height: 0;
    transition:  none;
    border: none;
    box-shadow: none;
  }

  & .ivu-radio-group,
  & .ivu-checkbox-group,
  & .ivu-tabs{
    min-height: 40px;
      width: 100%;
    .is-preview &{
      .makeContainer();
    }
  }

  & .ivu-tabs-tabpane{
    min-height: 40px;
    .is-preview &{
      .makeContainer();
    }
  }

  & .ivu-card-head{
    .is-preview &{
      .makeContainer();
    }
  }
  & .ivu-card-extra{
    .is-preview &{
      .makeContainer();
    }
  }
  & .ivu-card-body{
    .is-preview &{
      .makeContainer();
      padding: 20px;
    }
}
}

.is-preview  .ivu-card-extra .soul-drop-panel{
  min-height:100px;
}
.makeContainer(){
  min-height: 40px;
  transition:  box-shadow @transition-time linear;
  padding: 10px;
  border: 1px dashed #339ae2;

  //make drop be visible
  & .drop {
    box-shadow: 2px 2px 2px 2px #888888 inset;
  }
  &.drop {
    box-shadow: 2px 2px 2px 2px #888888 inset;
  }
}





